<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>layer.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <style type="text/css">
    	.titleClass{
    		color : green;
    	}
    </style>
    <script type="text/javascript" src="../mind.js"></script>
    <script type="text/javascript" src="mind-layer.js" charset="UTF-8"></script>
	<script type="text/javascript">
		mind(document).ready(function(){
			var layer1 = new $mind.layer({
				id : 'layerBtn1',//注册监听器的元素ID
				useOverlay : true,
				width : 300,
				body : '<p>今天是星期四。</p><p>虽然还没到周末，但是你很想她了吧？</p>'
			});
			mind("#layerBtn1Destory").click(function(){
				//销毁弹出层1
				layer1.destory();
				mind(this).val("已销毁");
			});
			
			var layer2 = new $mind.layer({
				id : 'layerBtn2',
				width : 300,
				height : 100,
				top : 50,
				left : 330,
				title : '吟诗一首' + (IS_IE ? '' : '(配置scroll:true)'),
				body : '<p style="color:red;font-size:16px;">又见利器在线出,</p><p style="color:red;font-size:16px;">规则代码助软工;</p><p style="color:red;font-size:16px;">待到新版强功能,</p><p style="color:red;font-size:16px;">我辈必能渡此工!</p>' 
			});
			mind("#layerBtn2Destory").click(function(){
				//销毁弹出层2
				layer2.destory();
				mind(this).val("已销毁");
			});
			
			var layer3 = new $mind.layer({
				id : 'layerBtn3',
				width : 650,
				height : 350,
				top : 50,
				left : 650,
				scroll : true,
				radius : 10,
				title : '讲一个故事' + (IS_IE ? '' : '(radius:10设置圆角弧度为10)'),
				titleCenter : true,
				titleClass : 'titleClass',
				body :  '<p>　　很多年前，我还年少的时候，喜欢下象棋，在学校里基本上我能下赢的，我总能下赢，我下不赢的，总也下不赢。不得其解，也慢慢懒得操练了。</p>' +
						'<p>　　后来有次学校搞业余活动，有个老师是省象棋协会的，组织了一节棋课。我去晚了，只听了半节。大致意思是讲，下棋要讲全局观，要有战略，例如中局五种策略，中局成杀、不成杀则优、不占优占先、不占先则多子、不多子则求和。还有什么炮破士、马破相、残局炮归家等等。却没有讲如何下棋，课堂上也没有摆个象棋，或是什么棋谱。</p>' +
						'<p>　　我并没有把这些当回事儿，之后也很少下棋。</p>' +
						'<p>　　又过多年，毕业后同学聚一起，闲来无事，与一个同学下了两盘。刚开始，他问我这两年有没有下棋，我说没有。他调侃我，&ldquo;那你以前下不赢我，今天你也难赢了&rdquo;。我也笑着认同，反正只是玩玩，何必认真。</p>' +
						'<p>可是一开局，他就傻眼了，一直处在下风，且每局必输。他很吃惊，我也很吃惊。之后我认真思考了这件事，觉得是那节棋课影响了我，人的思考能力、计算能力都差不多，而思维方式不同，结果也会有很大不同。他看到的是&ldquo;棋&rdquo;，我看到的是&ldquo;局&rdquo;。决定胜败的不是棋艺。</p>' +
						'<p>　　&nbsp;又过了几年，我已经不再年少，但还算年轻吧。有一次找一个朋友玩，正好他的一个朋友也在，吃完饭没事儿做，恰巧有副象棋，就与他的朋友下了几局。他们都比我年龄大，已经三十多岁了。不过我也没有放在眼里，自以为水平相当可以，三局我两胜，颇为自得。</p>' +
						'<p>　　等他走后，我朋友问我：&ldquo;他水平怎么样呀？&rdquo;我带着些&ldquo;谦虚&rdquo;，洋洋自得：&ldquo;他水平挺可以的，我差点就输了，还好我三局两胜，略胜那么一点点。&rdquo;</p>' +
						'<p>　　我朋友听完哈哈大笑：&ldquo;你知道他是干吗的吗？他是卖保险的。卖保险的吗，任何人都可能是他的潜在客户，他自然不会去赢你，不光让你赢，还要让你赢得有面子，这才是高手。他原来是在象棋协会的，论象棋，那叫牛&times;死了。&rdquo;</p>' +
						'<p>　　我听完之后，惭愧至极。我关注的是&ldquo;棋局&rdquo;，人家所关注的，则超脱棋局之外。眼界不一样，看到的也不一样，操控点也不一样，输赢已经不重要，重要的是输与赢，哪个更有利于自己，然后才是&ldquo;如何去输&rdquo;与&ldquo;如何去赢&rdquo;。棋局只是一个棋子。决定成败的不是棋艺。</p>' +
						'<p>　　&nbsp;我讲这个故事，是想说明，一个项目经理，对自己操作的项目要有全局观；而且，视角不能仅限于项目本身。明确自身定位，了解外部环境，才能最大成度影响到整个&ldquo;局&rdquo;中的各个元素，而这个影响力，就叫&ldquo;势&rdquo;。可以这么说，你明确的势力范围，可以只是你的团队，但你的影响力却不能仅限于团队本身。</p>' +
						'<p>　　做到这些，容易吗？当然不容易。如文章开头所说，&ldquo;做为一个项目经理，至少要在公司工作两年以上，且年龄不小于三十岁。&rdquo;这样，才有可能会做得好一些。</p>'
			});
			mind("#layerBtn3Destory").click(function(){
				//销毁弹出层3
				layer3.destory();
				mind(this).val("已销毁");
			});
			
			var layer4 = new $mind.layer({
				id : 'layerBtn4',//注册监听器的元素ID
				useOverlay : true,
				width : 300,
				top : 300,
				lazy : true,
				body : '<p>lazy用法：</p><p>开启后，注册的按钮click不会自动激活。</p><p>若要激活，需手动调用layer.active()</p>'
			});
			mind("#layerBtn4Active").click(function(){
				//激活按钮4
				layer4.active();
				mind("#layerBtn4").val("弹出层4（已激活）");
			});
			
			var layer5 = new $mind.layer({
				id : 'layerBtn5',//注册监听器的元素ID
				title : '百度一下', 
				width : 1000,
				height : 500,
				//lazy : true, //iframe框架不能使用开启lazy，否则需要点击两次按钮
				titleCenter : true,
				fixed : true, //禁用拖动
				top : IS_IE ? 45 : 35,
				body : '<iframe src="http://www.baidu.com/" frameborder="0" width="100%" height="100%" target="_self"></iframe>'
			});
		});
	</script>
  </head>
  
  <body>
    <center>
    	[<input id="layerBtn1" type="button" value="弹出层1" /><input id="layerBtn1Destory" type="button" value="销毁弹出层1" />]&nbsp;
    	[<input id="layerBtn2" type="button" value="弹出层2" /><input id="layerBtn2Destory" type="button" value="销毁弹出层2" />]&nbsp;
    	[<input id="layerBtn3" type="button" value="弹出层3" /><input id="layerBtn3Destory" type="button" value="销毁弹出层3" />]&nbsp;
       	[<input id="layerBtn4" type="button" value="弹出层4（需激活）" /><input id="layerBtn4Active" type="button" value="激活弹出层4" />]&nbsp;
       	[<input id="layerBtn5" type="button" value="弹出iframe" />]&nbsp;
    </center>
    </body>
</html>
